<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>vue 06</title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>

<body>
    <div id="app">{{msg}} {{obj}}
        <p v-if="seen"> 你看到我了 </p>
        <a v-bind:href="url">QQ</a>
        <div @click='click1'>
            <div @click.stop="click2">click me</div>
        </div>
    </div>
    <script text="text/javascript">
        var app = new Vue({
            el: '#app',
            data: {
                msg: "I am coming!",
                obj: new Date(),
                seen: false,
                url: "http://www.qq.com",
            },
            methods: {
                click1() {
                    console.log("click1 start");
                },
                click2() {
                    console.log("click2 start");
                },
            },
        });
        setTimeout(() => {
            app.seen = true;
        }, 2000);
    </script>
</body>